$(function(){
    // 封装分页获取数据的方法
//   function getPageData(pageIndex,pageSize){
    // 传递的参数太多了 建议使用对象的方式传参

    /**
     * 
     * @param {object} params
     * @example {
     *          categoryId : 分类的id,
     *          status : 状态,
     *          pageIndex : 获取第几页数据,
     *          pageSize : 页容量
     *  }
     */
    function getPageData(params){
        // 因为考虑到需要筛选数据 所以这里直接用筛选接口 
        $.post('/getPostByFilter',params,(res)=>{
            if(res.code==200){
                // 要替换掉表格中的内容
                let html = template('tp',res.data);
                $('tbody').html(html);
                initPagination(params.pageIndex,res.maxPage)
            }   
        })
    }
    // 直接调用获取分页数据的方法获取分页数据
    getPageData({
        categoryId:'all',
        status:'all',
        pageIndex:1,
        pageSize:10
    })
    // 生成分页结构
function initPagination(currentIndex,maxPage){
    // console.log(currentIndex,maxPage)
    // 中间总共有多少个按钮
    let buttonCount = 5;
    // 根据当前的页数和总个数 生成开头和结尾
    let start = currentIndex-Math.floor((buttonCount-1)/2);
    // 为了最小值超出范围 判断一下
    if(start<=1){
        start=1;
    }
    // 算出结尾
    let end = start+(buttonCount-1);
    if(end>=maxPage){
        end = maxPage;
        // 此时还需要算出从end 往前走的5个按钮
        start = end-(buttonCount-1);
        // 为了防止页数的不足 还要让页数不足的时候防止页数出现小于等于o 的情况
        if(start<=1){
            start = 1;
        }
    }
    // 从开头开始 到结尾结束 生成多个按钮
    let html = '';
    // 如果当前是第一页 就没有上一页
    if(currentIndex!=1){
        html += `<li class="page-item"><a data-index="${currentIndex - 1}" class="page-link" href="javascript:void(0);">上一页</a></li>`
    }
    for(let i=start;i<=end;i++){
        if(i===currentIndex){
            html = `<li class="page-item active"><a data-index="${i}" class="page-link" href="javascript:void(0);">${i}</a></li>`  ; 
        }else{
            html = `<li class="page-item "><a data-index="${i}" class="page-link" href="javascript:void(0);">${i}</a></li>`
        }
     

    }
    if(currentIndex!=maxPage){
        html+=`<li class="page-item"><a data-index="${currentIndex + 1}" class="page-link" href="javascript:void(0);">下一页</a></li>`
    }
    $('.pagination').html(html);
}
// 给分页按钮注册点击事件
$('.pagination').on('click','.page-link',function(){
    // 也要请求对应的页的数据
    // 当前点击的是第几页
    let pageIndex = parseInt($(this).attr('data-index'));
    // 设置当前页面的页容量
    let pageSize =10;
    // 获取所有分类
    let categoryId = $('#category').val();
    // 获取所有分类的状态
    let  status = $('#status').val();
    // 直接调用封装好的获取分页数据的方法
    getPageData({
        categoryId,
        status,
        pageIndex,
        pageSize
    });
})

$.get('/getAllCategory',(res)=>{
    // 把所有的分类 动态添加到下拉框里面
    let html = `<option value="all">所有分类</option>`;
    
    for(let i =0;i<=res.data.length;i++){
        html+= `<option value="${res.data[i].id}">${res.data.name}</option>`
    }
    $('#category').html(html)
})
// 给筛选按钮注册点击事件
$()
}) 